NVM.ScrollDetect = function () {
    var __core = NOVEM.Core;

    var _detects = [];

    var _percent = function (params) {
        var percent = 0,
            ratio = 0,
            start = 0,
            end = 0;

        var onScroll = function (params) {
            fastdom.measure(function () {
                var position = window.scrollY;

                if (position >= params.start && position <= params.end) {
                    var startViewScroll = position - params.start;
                    var offsetScroll = position - params.offset;
                    percent = (startViewScroll / params.range.full) * 100;
                    start = (startViewScroll / params.range.start);

                    if (position > (params.start + params.height) && position < (params.offset)) {
                        start = 1;
                        end = 0;
                    } else if (position >= (params.offset)) {
                        start = 1;
                        end = (offsetScroll / params.range.end);
                    } else {
                        end = 0;
                    }

                    ratio = start - end;
                } else if (position > params.end) {
                    percent = 100;
                    ratio = 0;
                    start = end = 1;
                } else {
                    percent = ratio = start = end = 0;
                }

                if (ratio > 0) {
                    params.elem.classList.add('scroll-detect-inview');
                } else {
                    params.elem.classList.remove('scroll-detect-inview');
                }

                if (start > 0 && start < 1) {
                    params.elem.classList.add('scroll-detect-inview-start');
                } else {
                    params.elem.classList.remove('scroll-detect-inview-start');
                }

                if (end > 0 && end < 1) {
                    params.elem.classList.add('scroll-detect-inview-end');
                } else {
                    params.elem.classList.remove('scroll-detect-inview-end');
                }

                params.elem.style.setProperty('--nvm-scroll-percent', percent);
                params.elem.style.setProperty('--nvm-scroll-ratio', ratio);
                params.elem.style.setProperty('--nvm-scroll-start', start);
                params.elem.style.setProperty('--nvm-scroll-end', end);
            });
        };

        onScroll(params);
    };

    var _handle = function () {
        _detects.forEach(function (settings) {
            _percent(settings);
        });
    }

    return {
        init: function (selector) {
            if (__core.getSelector(selector, false, false).length < 1) {
                return true;
            }

            __core.loadJS({ file: 'plugins/fastdom.js', id: 'nvm-fastdom-js', jsFolder: true });

            __core.isFuncTrue(function () {
                return typeof fastdom !== 'undefined';
            }).then(function (cond) {
                if (!cond) {
                    return false;
                }

                __core.initFunction({ class: 'has-plugin-scrolldetect', event: 'pluginScrollDetectReady' });

                selector = __core.getSelector(selector, false);
                if (selector.length < 1) {
                    return true;
                }

                var resizeObserver = new ResizeObserver(function (entries) {
                    entries.forEach(function (entry) {
                        if (!doing) {
                            var doing = setTimeout(function () {
                                initParams(selector);
                                doing = false;
                            }, 333);
                        }
                    });
                });

                var initParams = function (selector) {
                    _detects = [];

                    selector.forEach(function (elem) {
                        var elemWidth = elem.offsetWidth,
                            elemHeight = elem.offsetHeight,
                            elemOffset = __core.offset(elem).top,
                            viewportHeight = __core.getVars.viewport.height,
                            includeWidth = elem.getAttribute('data-include-width'),
                            includeHeight = elem.getAttribute('data-include-height'),
                            includeOffset = elem.getAttribute('data-include-offset'),
                            scrollOffset = elem.getAttribute('data-scroll-offset'),
                            parallaxRatio = elem.getAttribute('data-parallax-ratio'),
                            params = {};

                        if (scrollOffset) {
                            scrollOffset = scrollOffset.split('%');

                            if (scrollOffset.length > 1) {
                                elemOffset = elemOffset + (viewportHeight * Number(scrollOffset[0]) * 0.01);
                            } else if (scrollOffset.length == 1 && scrollOffset[0]) {
                                elemOffset = elemOffset + Number(scrollOffset[0]);
                            }
                        }

                        var scrollStart = elemOffset - viewportHeight,
                            scrollEnd = elemOffset + elemHeight,
                            scrollRange = scrollEnd - scrollStart;

                        params.elem = elem;
                        params.start = scrollStart;
                        params.end = scrollEnd;
                        params.range = {
                            start: elemHeight,
                            end: elemHeight,
                            full: scrollRange,
                        };
                        params.width = elemWidth;
                        params.height = elemHeight;
                        params.offset = elemOffset;

                        if (includeWidth == 'true' || (elem.classList.contains('parallax') && elem.getAttribute('data-parallax-direction') == 'horizontal')) {
                            elem.style.setProperty('--nvm-scroll-width', params.width);
                        }

                        if (includeHeight == 'true' || (elem.classList.contains('parallax') && elem.getAttribute('data-parallax-direction') != 'horizontal')) {
                            elem.style.setProperty('--nvm-scroll-height', params.height);
                        }

                        if (includeOffset == 'true') {
                            elem.style.setProperty('--nvm-scroll-offset', params.offset);
                        }

                        if (!isNaN(parallaxRatio)) {
                            elem.style.setProperty('--nvm-parallax-ratio', parallaxRatio);
                        }

                        _percent(params);
                        _detects.push(params);

                        resizeObserver.observe(elem);
                    });
                };

                initParams(selector);
                _handle();

                // var ticking = false;
                window.addEventListener("scroll", function () {
                    fastdom.mutate(function () {
                        _handle();
                    });
                    // if (!ticking) {
                    // 	window.requestAnimationFrame( function(){
                    // 		_handle();
                    // 		ticking = false;
                    // 	});
                    // 	ticking = true;
                    // }
                }, { passive: true });

                resizeObserver.observe(document.documentElement);
            });
        }
    };
}();
